// 登录页面业务逻辑

// 等待DOM加载完成
document.addEventListener('DOMContentLoaded', function() {
    // 获取电话号码输入框和密码输入框
    const phoneInput = document.querySelector('input[placeholder="请输入11位手机号码"]');
    const passwordInput = document.querySelector('input[type="password"]');
    const phoneLabel = document.querySelector('label.form-label:first-of-type');
    
    // 获取登录按钮
    const loginBtn = document.querySelector('.login-btn');
    
    if (!loginBtn || !phoneInput || !passwordInput) {
        console.error('未找到必要的表单元素');
        return;
    }
    
    // 为电话号码输入框添加键盘输入事件，只允许数字输入
    phoneInput.addEventListener('input', function(e) {
        // 移除非数字字符
        this.value = this.value.replace(/[^\d]/g, '');
    });
    
    // 为电话号码输入框添加失去焦点事件，验证手机号长度
    phoneInput.addEventListener('blur', function() {
        // 检查是否已经有错误提示元素
        let errorTip = this.nextElementSibling;
        if (errorTip && errorTip.classList.contains('error-tip')) {
            // 如果已经有，先移除
            errorTip.remove();
        }
        
        // 重置标签样式
        phoneLabel.innerHTML = '电话号码';
        phoneLabel.style.color = '';
        
        // 检查手机号长度
        if (this.value.length > 0 && this.value.length !== 11) {
            // 添加红色*号
            phoneLabel.innerHTML = '电话号码*';
            phoneLabel.style.color = '#ff4d4f';
            
            // 创建并显示错误提示
            errorTip = document.createElement('div');
            errorTip.className = 'error-tip';
            errorTip.textContent = '请输入11位手机号码';
            errorTip.style.position = 'absolute';
            errorTip.style.top = '50%';
            errorTip.style.right = '10px';
            errorTip.style.transform = 'translateY(-50%)';
            errorTip.style.backgroundColor = '#fff2f0';
            errorTip.style.color = '#ff4d4f';
            errorTip.style.padding = '4px 8px';
            errorTip.style.borderRadius = '4px';
            errorTip.style.fontSize = '12px';
            errorTip.style.boxShadow = '0 2px 8px rgba(0, 0, 0, 0.15)';
            errorTip.style.zIndex = '10';
            errorTip.style.lineHeight = '24px';
            errorTip.style.height = '24px';
            errorTip.style.display = 'inline-flex';
            errorTip.style.alignItems = 'center';
            errorTip.style.justifyContent = 'center';
            
            // 设置父元素为相对定位，以便错误提示正确定位
            const formGroup = this.closest('.form-group');
            if (formGroup) {
                formGroup.style.position = 'relative';
            }
            
            // 将错误提示添加到输入框后面
            this.parentNode.insertBefore(errorTip, this.nextSibling);
            
            // 添加错误边框样式
            this.style.borderColor = '#ff4d4f';
        } else {
            // 输入正确，移除错误边框
            this.style.borderColor = '';
        }
    });
    
    // 为电话号码输入框添加获得焦点事件，移除错误提示
    phoneInput.addEventListener('focus', function() {
        // 检查是否有错误提示元素
        let errorTip = this.nextElementSibling;
        if (errorTip && errorTip.classList.contains('error-tip')) {
            errorTip.remove();
        }
        
        // 重置标签样式
        phoneLabel.innerHTML = '电话号码';
        phoneLabel.style.color = '';
        
        // 移除错误边框
        this.style.borderColor = '';
    });
    
    // 为登录按钮添加点击事件
    loginBtn.addEventListener('click', function() {
        // 收集表单数据
        const credentials = {
            phone: phoneInput.value.trim(),
            password: passwordInput.value
        };
        
        // 基本客户端验证
        if (!credentials.phone || credentials.phone.length !== 11) {
            alert('请输入正确的11位手机号码');
            phoneInput.focus();
            return;
        }
        
        if (!credentials.password) {
            alert('请输入密码');
            passwordInput.focus();
            return;
        }
        
        // 显示加载状态
        loginBtn.disabled = true;
        loginBtn.textContent = '登录中...';
        
        // 使用项目中的API工具函数调用登录接口
        if (window.utils && window.utils.api && window.utils.api.post) {
            window.utils.api.post('/api/auth/login', credentials)
                .then(result => {
                    // 恢复按钮状态
                    loginBtn.disabled = false;
                    loginBtn.textContent = '登录';
                    
                    console.log('登录API返回结果:', result);
                    
                    // 根据状态码处理不同情况
                    if (result.code === 2000) {
                        // 登录成功
                        console.log('登录成功，返回结果:', result);
                        
                        // 保存token到cookie
                        if (result.token) {
                            if (window.AuthTokenManager && window.AuthTokenManager.saveAuthToken) {
                                // 优先使用独立的AuthTokenManager
                                window.AuthTokenManager.saveAuthToken(result.token);
                                console.log('Token已通过AuthTokenManager保存到cookie');
                            } else if (window.utils && window.utils.cookie && window.utils.cookie.saveAuthToken) {
                                // 其次使用原有的utils.cookie
                                window.utils.cookie.saveAuthToken(result.token);
                                console.log('Token已保存到cookie');
                            }
                        }
                        
                        // 保存用户信息到localStorage
                        if (result.userId) {
                            localStorage.setItem('userId', result.userId);
                        }
                        if (result.username) {
                            localStorage.setItem('username', result.username);
                        }
                        
                        alert('登录成功！');
                        // 登录成功后支持redirect参数跳转
                        const params = new URLSearchParams(window.location.search);
                        const redirect = params.get('redirect');
                        if (redirect) {
                            window.location.href = `./${redirect}`;
                        } else {
                            window.location.href = '../index.html';
                        }
                    } else if (result.code === 4001) {
                        // 用户未注册
                        alert('用户未注册');
                        // 清空所有输入框
                        phoneInput.value = '';
                        passwordInput.value = '';
                        phoneInput.focus();
                    } else if (result.code === 4002) {
                        // 密码错误
                        alert('密码错误');
                        // 仅清空密码输入框
                        passwordInput.value = '';
                        passwordInput.focus();
                    } else {
                        // 其他错误
                        alert('登录失败：' + (result.message || '未知错误'));
                    }
                })
                .catch(error => {
                    // 恢复按钮状态
                    loginBtn.disabled = false;
                    loginBtn.textContent = '登录';
                    
                    console.error('登录请求异常:', error);
                    alert('网络错误，请稍后重试');
                });
        } else {
            // 如果API工具不可用，使用备用方案
            console.warn('API工具不可用，使用备用fetch方案');
            
            fetch('http://localhost:8080/api/auth/login', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(credentials)
            })
            .then(response => {
                if (!response.ok) {
                    // 即使状态码不是200，也尝试解析JSON响应
                    return response.json().then(errData => {
                        throw errData;
                    });
                }
                return response.json();
            })
            .then(result => {
                // 恢复按钮状态
                loginBtn.disabled = false;
                loginBtn.textContent = '登录';
                
                // 根据状态码处理不同情况
                if (result.code === 2000) {
                    // 登录成功
                    
                    // 保存token到cookie
                    if (result.token) {
                        if (window.AuthTokenManager && window.AuthTokenManager.saveAuthToken) {
                            // 优先使用独立的AuthTokenManager
                            window.AuthTokenManager.saveAuthToken(result.token);
                        } else if (window.utils && window.utils.cookie && window.utils.cookie.saveAuthToken) {
                            // 其次使用原有的utils.cookie
                            window.utils.cookie.saveAuthToken(result.token);
                        } else {
                            // 手动设置cookie（备用方案）
                            document.cookie = `auth_token=${result.token}; path=/;`;
                        }
                    }
                    
                    // 保存用户信息到localStorage
                    if (result.userId) {
                        localStorage.setItem('userId', result.userId);
                    }
                    if (result.username) {
                        localStorage.setItem('username', result.username);
                    }
                    
                    alert('登录成功！');
                    const params = new URLSearchParams(window.location.search);
                    const redirect = params.get('redirect');
                    if (redirect) {
                        window.location.href = `./${redirect}`;
                    } else {
                        window.location.href = '../index.html';
                    }
                } else if (result.code === 4001) {
                    // 用户未注册
                    alert('用户未注册');
                    phoneInput.value = '';
                    passwordInput.value = '';
                    phoneInput.focus();
                } else if (result.code === 4002) {
                    // 密码错误
                    alert('密码错误');
                    passwordInput.value = '';
                    passwordInput.focus();
                } else {
                    alert('登录失败：' + (result.message || '未知错误'));
                }
            })
            .catch(error => {
                // 恢复按钮状态
                loginBtn.disabled = false;
                loginBtn.textContent = '登录';
                
                console.error('登录请求异常:', error);
                
                // 尝试检查是否有错误状态码
                if (error.code === 4001) {
                    alert('用户未注册');
                    phoneInput.value = '';
                    passwordInput.value = '';
                    phoneInput.focus();
                } else if (error.code === 4002) {
                    alert('密码错误');
                    passwordInput.value = '';
                    passwordInput.focus();
                } else {
                    alert('网络错误，请稍后重试');
                }
            });
        }
    });
    
    // 为密码输入框添加回车事件，自动触发登录
    passwordInput.addEventListener('keypress', function(e) {
        if (e.key === 'Enter') {
            loginBtn.click();
        }
    });
});